<%@include file="/WEB-INF/student_header.jsp"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>驾校学员信息系统</title>
</head>
<body>
	<div id="page-wrapper">
		<div class="row">
			<div class="col-lg-12">
				<h1 class="page-header">训练预约</h1>
			</div>
			<!-- /.col-lg-12 -->
		</div>
		<!-- /.row -->
		<div class="panel panel-default">
			<div class="panel-body">
			<p style="color: red; width: 100%; text-align: left" id="message">${message}</p>
				<form class="form-inline" id="Appoint">
					<div class="form-group">
						<label for="subject">训练科目</label> 
						<select class="form-control" id="subject" name="subject">
							<option value ="">
							--请选择--					
							</option>
							<option value ="科目一" >
							科目一					
							</option>
							<option value="科目二" >
							科目二								
							</option>
							<option value="科目三" >
							科目三							
							</option>
							<option value="科目四" >
							科目四							
							</option>
						</select>
						
						<label for="date">预约日期</label>
						<input class="form-control" type="date" id="date" name="date"/> 	
					</div>
					<div class="form-group">
						<button type="button" class="btn btn-primary" onclick="createAppoint('${status}')">申请</button>
						<button type="button" class="btn btn-primary" onclick="resetAll()">重置</button>
					</div>
				</form>
			</div>
		</div>
		<div class="row">
			<div class="col-lg-12">
				<div class="panel panel-default">
					<div class="panel-heading">训练预约列表</div>
					<!-- /.panel-heading -->
					<table id="table" class="table table-bordered table-striped">
						<thead>
							<tr>
								<th scope="col">ID</th>
								<th scope="col">训练科目</th>
								<th scope="col">训练地址</th>
								<th scope="col">训练时间</th>
								<th scope="col">状态</th>
								<th scope="col">操作</th>
							</tr>
						</thead>
						<tbody>
							<c:forEach items="${trainlist}" var="train">
								<tr>
									<td>${train.id}</td>
									<td>${train.subject}</td>
									<td>${train.address}</td>
									<td>${train.date}</td>
									<td>${train.status}</td>
									<th>
									<button type="button" class="btn btn-danger" onclick="cancelAppoint(${train.id})" ${train.status eq '申请成功'?'disabled="disabled"':''}>取消预约</button>
									</th>
								</tr>
							</c:forEach>
						</tbody>
					</table>
				</div>
				<!-- /.panel -->
			</div>
			<!-- /.col-lg-12 -->
		</div>
	</div>
	<!-- 分类列表查询部分  end-->
</body>
<script type="text/javascript">
//清空表单搜索框内容
function resetAll() {
	 $("#Appoint").find('input[type=date],select').each(function() {
     $(this).val('');
    });
}

//申请预约
function createAppoint(val){
	var nowdate = new Date();
	var seperator1 = "-";
    var year = nowdate.getFullYear();
    var month = nowdate.getMonth() + 1;
    var strDate = nowdate.getDate();
    if (month >= 1 && month <= 9) {
        month = "0" + month;
    }
    if (strDate >= 0 && strDate <= 9) {
        strDate = "0" + strDate;
    }
    var currentdate = year + seperator1 + month + seperator1 + strDate;
	var subject = $("#subject").val()
	var date = $("#date").val();
	if(subject == ''){
		$("#message").text("预约科目不能为空！");
		return false;
	}
	if(date == ''){
		$("#message").text("预约日期不能为空！");
		return false;
	}
	if(date < currentdate){
		$("#message").text("预约日期必须为今天以后的日期！");
		return false;
	}
	if(confirm("是否申请训练?")){
	if(val == '未考试' && subject != '科一'){
		$("#message").text("你还未通过任何考试，只能参加科目一的训练！");
		return false;
	}
	
	var status = val.substring(2);
	if(toChar(subject) <= toChar(status) ){
		$("#message").text("你已经通过该科目考试，请重新选择！");
		return false;
	}
	if(status == '科目一' && subject == '科目三'){
		$("#message").text("你未通过科二，不能预约科三训练！");
		return false;
	} 
	if(status == '科目一' && subject == '科目四'){
		$("#message").text("你未通过科二，不能预约科四训练！");
		return false;
	} 
	if(status == '科目二' && subject == '科目四'){
		$("#message").text("你未通过科三，不能预约科四训练！");
		return false;
	} 
	//ajax异步请求，三个参数
	$.post("${pageContext.request.contextPath}/student/trainAppoint.action",$("#Appoint").serialize(),
	//回调函数，得到的是json格式，controller层
		function(data){
	            if(data =="OK"){
	                alert("申请预约成功");
	                window.location.reload();
	            }else{
	                alert("申请预约失败");
	                window.location.reload();
	            }
	        });
	    }
}

function toChar(val){
	if(val=='科目一'){
		return '1';
	}else if(val=='科目二'){
		return '2'
	}else if(val=='科目三'){
		return '3'
	}else if(val=='科目四'){
		return '4'
	}
}


//删除分类
function cancelAppoint(val){
	if(confirm('确定要取消申请预约吗?')) {
		$.post("${pageContext.request.contextPath}/student/cancelAppoint.action",{'id':val},function(data){
	        if(data =="OK"){
	            alert("取消预约成功！");
	            window.location.reload();
	        }else{
	            alert("取消预约失败，请重试！");
	            window.location.reload();
	        } 
	    });
	}
}
</script>
</html>
<%@include file="/WEB-INF/footer.jsp"%>